<template>
  <article class="page">
    <headerbar>主办单位统计详情
    </headerbar>
    <section class="frame-content-sub no-bg" v-if="data">
      <section class="inner-content pdv-9 pdh-4 inner-noborder">

        <div class="input-column-wrap">
          <div class="name">培训计划名称：</div>
          <div class="text-left input-value color-tip">{{data.trainingclass}}</div>
        </div>
        <div class="input-column-wrap">
          <div class="name">办班单位：</div>
          <div class="text-left input-value color-tip">{{data.deptname}}</div>
        </div>
        <div class="input-column-wrap">
          <div class="name">培训对象：</div>
          <div class="text-left input-value color-tip">{{data.text}}</div>
        </div>

        <div class="input-column-wrap">
          <div class="name">培训人数：</div>
          <div class="text-left input-value color-tip">{{data.number}}</div>
        </div>
        <div class="input-column-wrap">
          <div class="name">培训期数：</div>
          <div class="text-left input-value color-tip">{{data.numberofperiods}}</div>
        </div>
        <div class="input-column-wrap">
          <div class="name">培训天数：</div>
          <div class="text-left input-value color-tip">{{data.days}}</div>
        </div>
        <div class="input-column-wrap">
          <div class="name">培训地点：</div>
          <div class="text-left input-value color-tip">{{data.div}}</div>
        </div>
        <div class="input-column-wrap">
          <div class="name">培训时间：</div>
          <div class="text-left input-value color-tip">{{data.time}}</div>
        </div>
        <div class="input-column-wrap">
          <div class="name">培训费用：</div>
          <div class="text-left input-value color-tip">{{data.trainmoney}}万</div>
        </div>
        <div class="input-column-wrap">
          <div class="name">减少金额：</div>
          <div class="text-left input-value color-tip">{{data.jsje}}万</div>
        </div>
        <div class="input-column-wrap flex-start">
          <div class="name pdt-2">培训内容：</div>
          <div class="text-left input-value color-tip pdh-3">{{data.trainingcontent}}</div>
        </div>

        <div v-if="data.type === '1' || data.type === '4'" @click="agreeAlert()" class="default-block-btn mgh-10">同意</div>
        <div v-if="data.type === '1' || data.type === '4'" @click="alert()" class="default-block-btn mgh-10">不同意</div>

    </section>

      <div class="block" v-if="data.type < 2">

        <div class="pdv-2"></div>
        <div class="radio-group">
          <cube-radio-group v-model="form.type" :options="typeOptions" :col-num="3" />
        </div>

        <div class="input-row-wrap">
          <div class="name pdh-5">请填写审批意见：</div>
          <div></div>
        </div>
        <div class="input-row-wrap pdh-2">
          <textarea v-model="form.content" placeholder="请填写审批意见" name="" cols="30" rows="10"></textarea>
        </div>
        <div @click="save" class="default-block-btn mgh-2">确认</div>

        <p class="pdv-2"></p>
      </div>

    </section>
  </article>
</template>

<script>
  import _ from 'lodash'
  export default {
    data () {
      return {
        data: {},
        form: {},
        userInfo: this.$store.state.userInfo
      }
    },
    created () {
      this.data = this.$store.state.trainingPlanDetail
      this.loadData()
    },
    methods: {
      loadData () {
        let query = this.$route.query
        let params = {
          id: this.$route.query.id,
          numberofperiods: query.numberofperiods
        }
        this.fetchService.trainingPlanInfo(params).then(res => {
          if (res.code !== 0) {
            return this.tools.tip(res.message || '接口服务出错，请联系管理员')
          }
          this.data = _.extend(this.data, res.data)
        })
      }
    }
  }
</script>

<style scoped>

</style>
